<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        
    </style>
</head>
<body>
    
</body>
<script>
    
    // function Parent(m){
    //     this.msg = m;
    //     this.show = function(){
    //         console.log(this.msg);
    //     }
    // }

    // function Child(m){
    //     // 改变Parent内的this
    //     // Parent.call(this, m)
    //     // Parent.apply(this, [m])
    //     Parent.bind(this, m)()
    // }

    
    // const c1 = new Child("world")
    // console.log(c1);
    // c1.show();

    // const p = new Parent("hello");
    // console.log(p);
    // p.show();

    // const c2 = new Child("hahahha")
    // console.log(c2);
    // c2.show();


    // new的原理：
        // 1. 创建新对象
        // 2. 修改新对象的__pr。。。。。
        // 3. 改变原函数的this指向为这个新对象
        // 4. 执行函数代码
        // 5. 检测函数是否主动返回对象，如果没有，返回这个新对象

    // ========

    // function Button(){
    //     this.button = "这是按钮功能";
    //     this.a = 10;
    // }
    
    // function List(){
    //     this.list = "这是分页器功能";
    //     this.a = 20;
    // }
    
    // function Img(){
    //     this.img = "这是图片功能";
    //     this.a = 30;
    // }

    // function Banner(){
    //     this.img = "这是在Banner类中的img"
    //     Img.call(this);
    //     Button.call(this);
    //     List.call(this);
    // }

    // const b = new Banner();
    // console.log(b);

    // ===========

    function Parent(m){
        this.msg = m;
        this.show = function(){
            console.log(this.msg);
        }
    }
    Parent.prototype.init = function(){
        console.log("init")
    }

    function Child(m){
        Parent.call(this, m)
    }

    
    const c1 = new Child("world")
    console.log(c1);
    c1.show();
    c1.init();

    const p = new Parent("hello");
    console.log(p);
    p.show();
    p.init();
</script>
</html>